<form name="form" ng-init="vm.init();refresh(vm.callback);" novalidate>
  <script id="opt-toolbar" type="text/ng-template">
    <div>
      <button class="btn btn-default" type="button" ng-disabled="form.$invalid"
           ng-click="vm.match(form.$valid)"><i class="fa fa-hashtag"></i> 匹配参数</button>
      <button id="copy" class="btn btn-default" type="button" ng-disabled="vm.code == ''">
        <i class="fa fa-copy"></i> 复制</button>
      <button class="btn btn-default" type="button" ng-click="vm.reset()">
        <i class="fa fa-repeat"></i> 重置</button>
    </div>
  </script>
  <div class="row x-view-body">
    <div class="col-md-7 x-view-line">
      <div class="x-view-scope">
        <div class="form-group">
          <label class="control-label">Preparing SQL：</label>
          <textarea class="form-control" rows="10" name="preparingSql" ng-model="vm.preparingSql" autofocus required
              ng-class="{'x-invalid': form.$submitted && form.preparingSql.$invalid}"></textarea>
          <p class="text-danger" ng-show="form.$submitted && form.preparingSql.$error.required">SQL不能为空</p>
        </div>
        <div class="form-group">
          <label class="control-label">Parameters：</label>
          <textarea class="form-control" rows="10" name="parameters" ng-model="vm.parameters" required
              ng-class="{'x-invalid': form.$submitted && form.parameters.$invalid}"></textarea>
          <p class="text-danger" ng-show="form.$submitted && form.parameters.$error.required">参数不能为空</p>
        </div>
      </div>
    </div>
    <div class="col-md-5">
      <div class="x-view-scope">
        <div class="x-editor">
          <pre class="x-output" id="sql-viewer"></pre>
        </div>
      </div>
    </div>
  </div>
</form>
